<div class="admin-container" admins-admin-data>
  <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">Admins</strong> / <small>Item</small></div>
      </div>

      <div class="am-g">
        <div class="am-u-sm-12 am-u-md-6">
          <div class="am-btn-toolbar">
            <div class="am-btn-group am-btn-group-xs">
              <button type="button" class="am-btn am-btn-default" data-am-modal="{target: '#admin-add-modal', closeViaDimmer: 0, width: 400, height: 500}" ng-click=""><span class="am-icon-plus"></span> Add</button>
            </div>
          </div>
        </div>
        <div class="am-u-sm-6 am-u-md-2">
          <div class="am-form-group admin-page-list">
            <select id="page-size">
              <option value="10">10</option>
              <option value="20">20</option>
              <option value="50">50</option>
              <option value="All">All</option>
            </select>
          </div>
        </div>
        <div class="am-u-sm-12 am-u-md-3">
          <div class="am-input-group am-input-group-sm admin-filter">
            <input type="text" class="am-form-field search-admin" ng-keyup="searchadmins($event)" ng-model="search">
            <span class="am-input-group-btn">
              <button class="am-btn am-btn-default" type="button">Search</button>
            </span>
          </div>
        </div>
      </div>

      <div class="am-g">
        <div class="am-u-sm-12">
            <table class="am-table am-table-striped am-table-hover " id="admin-table">
              <thead>
                <tr>
                  <th class="table-check"></th>
                  <th class="table-id">AdminUserId</th>
                  <th class="table-title">UserName</th>
                  <th class="table-title">FirstName</th>
                  <th class="table-title">LastName</th>
                  <th class="table-title">LastName</th>
                  <th class="table-set">Email</th>
                </tr>
            </thead>
            <tbody>
              <tr ng-repeat="admin in admins.result">
                <td class="select-column"><input type="checkbox" name="select-single-admin" class="select-single-record" ng-click="selectSingleRecord($event)"/></td>
                <td class="admin">{{admin.adminUserId}}</td>
                <td class="admin">{{admin.username}}</td>
                <td class="admin">{{admin.firstName}}</td>
                <td class="admin">{{admin.lastName}}</td>
                <td class="admin">{{admin.email}}</td>
               
                <td>
                  <div class="am-btn-toolbar">
                     <button class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only" ng-click="remove(admin)"><span class="am-icon-trash-o"></span> Delete</button>
                  </div>
                </td>
              </tr> 
             
            </tbody>
          </table>
            <div class="am-cf">
              Total <span class="admin-total-record">0</span> records
        <div class="am-fr">
          <ul class="am-pagination admin-pager-container">
          </ul>
        </div>
        </div>
     <hr />
       <p>Attention</p>
     </div>
  </div>
</div>

<!--    add admin modal   -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="admin-add-modal" data-admin-add-admin>
  <div class="am-modal-dialog">
    <div class="am-modal-hd">
      Add Admin
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-u-sm-12">
     <div class="am-modal-bd ">
       <form class="am-form" id="add-admin-form" data-am-validator>
      <fieldset>
        <div class="am-form-group">
          <label for="name">UserName：</label>
          <input type="text" name="name" minlength="3"  ng-model="add.userName" required/>
        </div>
         <div class="am-form-group">
          <label for="name">FirstName：</label>
         
          <input type="text" name="birthday" minlength="1"  ng-model="add.firstName"  required/>
        </div>

        <div class="am-form-group">
          <label for="questDescription">LastName:</label>
          <input type="text" name="childGender" minlength="1"  ng-model="add.lastName" required/>
        </div>

        <div class="am-form-group">
          <label for="questObjects">Email</label>
          <input type="text" name="age" minlength="1"  ng-model="add.email" required/>
        </div>
        <button class="am-btn am-btn-secondary" ng-click="addadmin(add)" >Add</button>
      </fieldset>
    </form>
    </div>
  </div>
</div>